<template>
  <a-drawer
    :maskClosable="true"
    width="80%"
    placement="right"
    :closable="false"
    @close="handleCancel"
    :destroyOnClose="true"
    :visible="visible"
    style="padding: 0px"
  >
    <!-- 头部信息 -->
    <div class="device-header">
      <div class="device-info">
        <div class="device-info">
          <span class="device-id">{{ deviceInfo.deviceShortCode }}</span>
          <span class="device-name">{{ deviceInfo.deviceName }}</span>
        </div>
        <div class="device-status">
          <span
            v-if="deviceInfo.activeState == '3'"
            class="status-tag"
            style="
              background: rgb(253, 246, 236);
              color: rgb(230, 162, 60);
              border: 1px solid rgb(250, 236, 216);
            "
            >故障停机
          </span>
          <span
            v-if="deviceInfo.activeState == '0'"
            class="status-tag"
            style="
              color: rgb(64, 158, 255);
              background: rgb(236, 245, 255);
              border: 1px solid rgb(217, 236, 255);
            "
          >
            使用中
          </span>
          <span
            v-if="deviceInfo.activeState == '1'"
            class="status-tag"
            style="
              background: rgb(240, 249, 235);
              color: rgb(103, 194, 58);
              border: 1px solid rgb(225, 243, 216);
            "
          >
            待机
          </span>
          <span
            v-if="deviceInfo.repairState == '3'"
            class="status-tag"
            style="
              background: rgb(244, 244, 245);
              color: rgb(144, 147, 153);
              border: 1px solid rgb(233, 233, 235);
            "
            >未保</span
          >
          <span
            v-if="deviceInfo.repairState == '1'"
            class="status-tag"
            style="background: #1ba035; color: #1ba035; border: 1px solid"
            >在保</span
          >
          <span
            v-if="deviceInfo.repairState == '2'"
            class="status-tag"
            style="
              color: rgb(254, 240, 240);
              background: rgb(245, 108, 108);
              border: 1px solid rgb(253, 226, 226);
            "
            >出保</span
          >
        </div>
      </div>
      <div class="record-info">
        <span>录入人:</span> &nbsp;{{ getCreateByName(deviceInfo.inputPerson)
        }}<br />
        <span style="letter-spacing: 7px">时间:</span>&nbsp;{{
          deviceInfo.createTime
        }}
      </div>

      <img :src="deviceInfo.qrCodeBase64" style="width: 60px" />
    </div>
    <div class="line"></div>
    <!-- 标签页 -->
    <div class="tabs-container">
      <a-tabs
        v-model="activeTab"
        @change="tabChange"
        :tabBarStyle="{ borderBottom: 'solid 1px #d7d7d7' }"
      >
        <a-tab-pane key="management" tab="设备信息"></a-tab-pane>
        <a-tab-pane key="basic" tab="资产信息"></a-tab-pane>
        <a-tab-pane key="operation" tab="管理记录"></a-tab-pane>
        <a-tab-pane key="documents" tab="相关文档"></a-tab-pane>
        <a-tab-pane key="process" tab="动态监测"></a-tab-pane>
        <a-tab-pane key="instructions" tab="使用说明"></a-tab-pane>
        <a-tab-pane key="leanProcessRecord" tab="精益流程记录"></a-tab-pane>
        <a-tab-pane key="operationLog" tab="操作日志"></a-tab-pane>
      </a-tabs>
    </div>

    <!-- 内容区域 -->
    <div v-if="activeTab === 'management'" class="content-wrapper">
      <!-- 管理信息表单 -->
      <div class="management-form">
        <!-- 管理信息模块 -->
        <div class="info-module">
          <div class="module-header">
            <div class="module-title">管理信息</div>
            <div class="module-actions">
              <a
                v-if="!managementEditable"
                @click="managementEditModule('management')"
                v-wx-role="101302"
              >
                <a-icon type="edit"
              /></a>
              <a-button
                v-if="managementEditable"
                style="
                  font-size: 12px;
                  width: 40px;
                  background: #ffffff;
                  color: #f04764;
                  border: 1px solid;
                "
                @click="managementCancelEdit('management')"
                >取消</a-button
              >
              <a-button
                style="font-size: 12px; width: 40px"
                v-if="managementEditable"
                type="primary"
                @click="managementSaveModule('management')"
                >保存</a-button
              >
            </div>
          </div>

          <div class="form-content">
            <a-form-model
              layout="horizontal"
              ref="ruleForm"
              :model="management"
              :label-col="$global.labelCol"
              :wrapper-col="$global.wrapperCol"
            >
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="所属科室："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                    :rules="$valid.required"
                    prop="departmentId"
                  >
                    <a-tree-select
                      v-if="managementEditable"
                      v-model="management.departmentIds"
                      style="width: 100%"
                      :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
                      placeholder="请选择所属科室"
                      allow-clear
                      tree-default-expand-all
                      :tree-data="departmentTree"
                      @change="forceUpdate"
                    ></a-tree-select>
                    <!-- <a-tree-select
                      v-if="managementEditable"
                      :disbeled="!managementEditable"
                      v-model="management.departmentIds"
                      style="width: 100%"
                      tree-checkable
                      :treeCheckStrictly="true"
                      allow-clear
                      :tree-data="departmentTree"
                      placeholder="请选择所属科室"
                      @change="forceUpdate"
                    /> -->
                    <span class="span-line-height" v-if="!managementEditable">{{
                      deviceInfo.departmentIdNames
                    }}</span>
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="医疗器械分类目录："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-tree-select
                      v-if="managementEditable"
                      v-model="management.deviceClassificationIds"
                      style="width: 100%"
                      :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
                      placeholder="请选择医疗器械分类目录"
                      allow-clear
                      tree-default-expand-all
                      :tree-data="deviceClassificationTree"
                      @change="forceUpdate"
                    ></a-tree-select>
                    <!-- <a-tree-select
                      v-if="managementEditable"
                      v-model="management.deviceClassificationIds"
                      :tree-data="deviceClassificationTree"
                      tree-checkable
                      :treeCheckStrictly="true"
                      allow-clear
                      placeholder="请选择医疗器械分类目录"
                      :disabled="!managementEditable"
                      @change="forceUpdate"
                    /> -->
                    <span class="span-line-height" v-if="!managementEditable">{{
                      deviceInfo.deviceClassificationIdNames
                    }}</span>
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="使用科室："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                    :rules="$valid.required"
                    prop="departmentId"
                  >
                    <a-tree-select
                      v-if="managementEditable"
                      v-model="management.usingDepartmentIds"
                      style="width: 100%"
                      :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
                      placeholder="请选择使用科室"
                      allow-clear
                      tree-default-expand-all
                      :tree-data="departmentTree"
                      @change="forceUpdate"
                    ></a-tree-select>
                    <!-- <a-tree-select
                      v-if="managementEditable"
                      v-model="management.usingDepartmentIds"
                      style="width: 100%"
                      tree-checkable
                      :treeCheckStrictly="true"
                      allow-clear
                      :tree-data="departmentTree"
                      placeholder="请选择使用科室"
                      :disabled="!managementEditable"
                      @change="forceUpdate"
                    /> -->
                    <span class="span-line-height" v-if="!managementEditable">{{
                      deviceInfo.usingDepartmentIdNames
                    }}</span>
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="实施强制管理的计量器具："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-tree-select
                      v-if="managementEditable"
                      v-model="management.measurementInstruments"
                      style="width: 100%"
                      :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
                      placeholder="请选择实施强制管理的计量器具"
                      allow-clear
                      tree-default-expand-all
                      :tree-data="measurementInstrumentTree"
                      @change="forceUpdate"
                    ></a-tree-select>
                    <!-- <a-tree-select
                      v-if="managementEditable"
                      v-model="management.measurementInstruments"
                      style="width: 100%"
                      tree-checkable
                      :treeCheckStrictly="true"
                      allow-clear
                      :tree-data="measurementInstrumentTree"
                      placeholder="请选择实施强制管理的计量器具"
                      :disabled="!managementEditable"
                      @change="forceUpdate"
                    /> -->
                    <span class="span-line-height" v-if="!managementEditable">{{
                      deviceInfo.measurementInstrumentNames
                    }}</span>
                  </a-form-model-item>
                </a-col>
              </a-row>

              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="管理部门："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-select
                      v-if="managementEditable"
                      style="min-width: 100px"
                      v-model="management.administrativeDept"
                      :disabled="!managementEditable"
                      placeholder="请选择管理部门"
                      class="my-select"
                      allow-clear
                      @change="forceUpdate"
                    >
                      <a-select-option
                        v-for="item in this.$sysDictOptions(
                          'administrativeDept'
                        )"
                        :key="item.k"
                        :value="item.k"
                      >
                        {{ item.v }}
                      </a-select-option>
                    </a-select>
                    <span class="span-line-height" v-if="!managementEditable">{{
                      getDictName(
                        deviceInfo.administrativeDept,
                        'administrativeDept'
                      )
                    }}</span>
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="政府采购品分类："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-tree-select
                      v-if="managementEditable"
                      v-model="management.politicalProcurementCatalogueIds"
                      style="width: 100%"
                      :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
                      placeholder="请选择政府采购品分类"
                      allow-clear
                      tree-default-expand-all
                      :tree-data="politicalProcurementCatalogueTree"
                      @change="forceUpdate"
                    ></a-tree-select>
                    <!-- <a-tree-select
                      v-if="managementEditable"
                      v-model:value="
                        management.politicalProcurementCatalogueIds
                      "
                      :disabled="!managementEditable"
                      :tree-data="politicalProcurementCatalogueTree"
                      tree-checkable
                      :treeCheckStrictly="true"
                      allow-clear
                      placeholder="请选择政府采购品分类"
                      @change="forceUpdate"
                    /> -->
                    <span class="span-line-height" v-if="!managementEditable">{{
                      deviceInfo.politicalProcurementCatalogueIdNames
                    }}</span>
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="使用人："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-select
                      v-if="managementEditable"
                      :showArrow="true"
                      :allowClear="true"
                      v-model="management.userName"
                      placeholder="请选择使用人"
                      :disabled="!managementEditable"
                      @change="forceUpdate"
                    >
                      <a-select-option
                        v-for="item in createByList"
                        :key="item.companyId + ''"
                        :value="item.companyId + ''"
                      >
                        {{ item.companyName }}
                      </a-select-option>
                    </a-select>
                    <span class="span-line-height" v-if="!managementEditable">{{
                      getCreateByName(deviceInfo.userName)
                    }}</span>
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="部队医院通用名称："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-tree-select
                      v-if="managementEditable"
                      v-model="management.commonMilitaryNameIds"
                      style="width: 100%"
                      :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
                      placeholder="请选择部队医院通用名称"
                      allow-clear
                      tree-default-expand-all
                      :tree-data="commonMilitaryNameTree"
                      @change="forceUpdate"
                    ></a-tree-select>
                    <!-- <a-tree-select
                      v-if="managementEditable"
                      v-model:value="management.commonMilitaryNameIds"
                      :tree-data="commonMilitaryNameTree"
                      tree-checkable
                      :treeCheckStrictly="true"
                      allow-clear
                      :disabled="!managementEditable"
                      placeholder="请选择部队医院通用名称"
                      @change="forceUpdate"
                    /> -->
                    <span class="span-line-height" v-if="!managementEditable">{{
                      deviceInfo.commonMilitaryNameIdNames
                    }}</span>
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="号码牌："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      v-model="management.plateNumber"
                      :disabled="!managementEditable"
                      placeholder="请输入号码牌(例如:#1111)"
                    ></a-input>
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="固定资产等基础分类代码："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-tree-select
                      v-if="managementEditable"
                      v-model="management.fixedClassificationIds"
                      style="width: 100%"
                      :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
                      placeholder="请选择固定资产等基础分类代码"
                      allow-clear
                      tree-default-expand-all
                      :tree-data="fixedClassificationTree"
                      @change="forceUpdate"
                    ></a-tree-select>
                    <!-- <a-tree-select
                      v-if="managementEditable"
                      v-model:value="management.fixedClassificationIds"
                      style="width: 100%"
                      :tree-data="fixedClassificationTree"
                      tree-checkable
                      allow-clear
                      :disabled="!managementEditable"
                      :treeCheckStrictly="true"
                      placeholder="请选择固定资产等基础分类代码"
                      @change="forceUpdate"
                    /> -->
                    <span class="span-line-height" v-if="!managementEditable">{{
                      deviceInfo.fixedClassificationIdNames
                    }}</span>
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="资产管理员："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-select
                      v-if="managementEditable"
                      :showArrow="true"
                      :allowClear="true"
                      v-model="management.assetManager"
                      placeholder="请选择资产管理员"
                      :disabled="!managementEditable"
                      @change="forceUpdate"
                    >
                      <a-select-option
                        v-for="item in createByList"
                        :key="item.companyId + ''"
                        :value="item.companyId + ''"
                      >
                        {{ item.companyName }}
                      </a-select-option>
                    </a-select>
                    <span class="span-line-height" v-if="!managementEditable">{{
                      getCreateByName(deviceInfo.assetManager)
                    }}</span>
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="高等学校固定资产分类代码："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-tree-select
                      v-if="managementEditable"
                      v-model="management.fixedAssetClassificationCodeIds"
                      style="width: 100%"
                      :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
                      placeholder="请选择高等学校固定资产分类"
                      allow-clear
                      tree-default-expand-all
                      :tree-data="fixedAssetClassificationCodeTree"
                      @change="forceUpdate"
                    ></a-tree-select>
                    <!-- <a-tree-select
                      v-if="managementEditable"
                      v-model:value="management.fixedAssetClassificationCodeIds"
                      :disabled="!managementEditable"
                      :tree-data="fixedAssetClassificationCodeTree"
                      tree-checkable
                      allow-clear
                      :treeCheckStrictly="true"
                      placeholder="请选择高等学校固定资产分类"
                      @change="forceUpdate"
                    /> -->
                    <span class="span-line-height" v-if="!managementEditable">{{
                      deviceInfo.fixedAssetClassificationCodeIdNames
                    }}</span>
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="当前位置："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                    :rules="$valid.required"
                  >
                    <a-cascader
                      v-if="managementEditable"
                      :disabled="!managementEditable"
                      v-model="management.currentLocations"
                      :options="campusBuildingFloorRoomTree"
                      :change-on-select="false"
                      expand-trigger="click"
                      placeholder="请选择当前位置"
                      @change="forceUpdate"
                    ></a-cascader>
                    <span class="span-line-height" v-if="!managementEditable">{{
                      deviceInfo.currentLocationNames
                    }}</span>
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="行业专业分类："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      v-model="management.industryProfessionalClassification"
                      :disabled="!managementEditable"
                      placeholder="请输入行业专业分类"
                    ></a-input>
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col :span="12">
                  <span style="margin-left: 334px" v-if="managementEditable">
                    <a @click="configLocation">未找到位置？前去配置</a>
                  </span>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="专业分类："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-tree-select
                      v-if="managementEditable"
                      v-model="management.professionalClassificationIds"
                      style="width: 100%"
                      :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
                      placeholder="请选择专业分类"
                      allow-clear
                      tree-default-expand-all
                      :tree-data="professionalClassificationIdTree"
                      @change="forceUpdate"
                    ></a-tree-select>
                    <!-- <a-tree-select
                      v-if="managementEditable"
                      v-model:value="management.professionalClassificationIds"
                      :tree-data="professionalClassificationIdTree"
                      tree-checkable
                      :treeCheckStrictly="true"
                      allow-clear
                      :disabled="!managementEditable"
                      placeholder="请选择专业分类"
                      @change="forceUpdate"
                    /> -->
                    <span class="span-line-height" v-if="!managementEditable">{{
                      deviceInfo.professionalClassificationIdNames
                    }}</span>
                  </a-form-model-item>
                </a-col>
              </a-row>
            </a-form-model>
          </div>
        </div>
      </div>

      <!-- 基础信息表单 -->
      <div class="management-form">
        <!-- 基础信息模块 -->
        <div class="info-module">
          <div class="module-header">
            <div class="module-title">基础信息</div>
            <div class="module-actions">
              <a
                v-if="!basicInformationEditable"
                @click="basicInformationEditModule()"
                v-wx-role="101302"
              >
                <a-icon type="edit"
              /></a>
              <a-button
                v-if="basicInformationEditable"
                style="
                  font-size: 12px;
                  width: 40px;
                  background: #ffffff;
                  color: #f04764;
                  border: 1px solid;
                "
                @click="basicInformationCancelEdit()"
                >取消</a-button
              >
              <a-button
                style="font-size: 12px; width: 40px"
                v-if="basicInformationEditable"
                type="primary"
                @click="basicInformationSaveModule()"
                >保存</a-button
              >
            </div>
          </div>
          <div class="form-content">
            <a-form layout="horizontal">
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="类型："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                    :rules="$valid.required"
                  >
                    <a-tree-select
                      v-if="basicInformationEditable"
                      v-model="basicInformation.deviceTypes"
                      style="width: 100%"
                      :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
                      placeholder="请选择类型"
                      allow-clear
                      tree-default-expand-all
                      :tree-data="deviceTypeTree"
                      @change="forceUpdate"
                    ></a-tree-select>
                    <!-- <a-tree-select
                      v-if="basicInformationEditable"
                      v-model="basicInformation.deviceTypes"
                      :tree-data="deviceTypeTree"
                      tree-checkable
                      :treeCheckStrictly="true"
                      allow-clear
                      :disabled="!basicInformationEditable"
                      placeholder="请选择类型"
                      @change="forceUpdate"
                    /> -->
                    <span
                      class="span-line-height"
                      v-if="!basicInformationEditable"
                      >{{ deviceInfo.professionalClassificationIdNames }}</span
                    >
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="医疗器械注册/备案证号："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      v-model="basicInformation.certificateNumber"
                      :disabled="!basicInformationEditable"
                      placeholder="请输入医疗器械注册/备案证号"
                    ></a-input>
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="设备名称："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                    :rules="$valid.required"
                  >
                    <a-input
                      class="input"
                      v-model="basicInformation.deviceName"
                      :disabled="!basicInformationEditable"
                      placeholder="请输入设备名称"
                    ></a-input>
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="品牌："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      class="input"
                      v-model="basicInformation.bind"
                      :disabled="!basicInformationEditable"
                      placeholder="请输入品牌"
                    ></a-input>
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="型号："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      class="input"
                      v-model="basicInformation.model"
                      :disabled="!basicInformationEditable"
                      placeholder="请输入型号"
                    ></a-input>
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="生产厂商："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      v-model="basicInformation.manufacturerName"
                      :disabled="!basicInformationEditable"
                      placeholder="请输入生产厂商"
                    ></a-input>
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="注册68分类："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      :disabled="!basicInformationEditable"
                      v-model="basicInformation.registerCategories"
                      placeholder="请输入注册68分类"
                    >
                    </a-input>
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="管理类别："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      :disabled="!basicInformationEditable"
                      v-model="basicInformation.managementCategory"
                      placeholder="请输入管理类别"
                    >
                    </a-input>
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="UDI："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      v-model="basicInformation.udi"
                      :disabled="!basicInformationEditable"
                      placeholder="请输入UDI"
                    ></a-input>
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="序列号："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      v-model="basicInformation.serialNumber"
                      :disabled="!basicInformationEditable"
                      placeholder="请输入序列号"
                    ></a-input>
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="生产日期："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-date-picker
                      v-if="basicInformationEditable"
                      v-model="basicInformation.manufactureDate"
                      inputReadOnly
                      type="date"
                      format="YYYY-MM-DD"
                      valueFormat="YYYY-MM-DD"
                      :disabled="!basicInformationEditable"
                      placeholder="请选择生产日期"
                      @change="manufactureDateChange"
                      style="width: 100%"
                    />
                    <span
                      class="span-line-height"
                      v-if="!basicInformationEditable"
                      >{{ deviceInfo.manufactureDate }}</span
                    >
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="批号："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      v-model="basicInformation.batchNumber"
                      :disabled="!basicInformationEditable"
                      placeholder="请输入批号"
                    ></a-input>
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="使用有效期(年)："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      v-model="basicInformation.useValidityPeriod"
                      :disabled="!basicInformationEditable"
                      placeholder="请输入使用有效期(年)"
                    ></a-input>
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="失效日期："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-radio-group
                      v-model="basicInformation.isExpiringDate"
                      style="line-height: 35px"
                      :disabled="!basicInformationEditable"
                    >
                      <a-radio key="0" value="0" class="radio-item"
                        >不适用</a-radio
                      >
                      <a-radio key="1" value="1" class="radio-item"
                        >适用</a-radio
                      >
                    </a-radio-group>
                    <a-date-picker
                      v-if="
                        basicInformation.isExpiringDate == '1' &&
                        basicInformationEditable
                      "
                      v-model="basicInformation.expiringDate"
                      inputReadOnly
                      type="date"
                      format="YYYY-MM-DD"
                      valueFormat="YYYY-MM-DD"
                      :disabled="!basicInformationEditable"
                      placeholder="请选择失效日期"
                      @change="expiringDateChange"
                      style="width: 100%"
                    />
                    <span
                      class="span-line-height"
                      v-if="
                        basicInformation.isExpiringDate == '1' &&
                        !basicInformationEditable
                      "
                      >{{ deviceInfo.manufactureDate }}</span
                    >
                  </a-form-model-item>
                </a-col>
              </a-row>
            </a-form>
          </div>
        </div>
      </div>

      <!-- 行业标准信息表单 -->
      <div class="management-form">
        <!-- 行业标准信息模块 -->
        <div class="info-module">
          <div class="module-header">
            <div class="module-title">行业标准信息</div>
            <div class="module-actions">
              <a
                v-if="!industryStandardsEditable"
                @click="industryStandardsEditModule()"
                v-wx-role="101302"
                >纠错
              </a>
              <a
                v-if="industryStandardsEditable"
                @click="industryStandardsSaveModule()"
                v-wx-role="101302"
                >保存
              </a>
            </div>
          </div>
          <div class="form-content">
            <a-form layout="horizontal">
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="通用名："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                    :rules="$valid.required"
                  >
                    <span class="span-line-height">{{
                      industryStandards.commonName
                    }}</span>

                    <a
                      style="margin-left: 15px"
                      v-if="
                        industryStandardsEditable &&
                        industryStandards.commonName == 'Unknown'
                      "
                      @click="commonNameErrorCorrection()"
                      v-wx-role="101302"
                      >纠错
                    </a>

                    <a
                      style="margin-left: 15px"
                      v-if="
                        industryStandardsEditable &&
                        industryStandards.commonName != 'Unknown'
                      "
                      @click="commonNameErrorCorrection()"
                      v-wx-role="101302"
                      >取消纠错
                    </a>
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="类型："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-tree-select
                      v-if="industryStandardsEditable"
                      v-model="industryStandards.industryType"
                      style="width: 100%"
                      :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
                      placeholder="请选择类型"
                      allow-clear
                      tree-default-expand-all
                      :tree-data="deviceTypeTree"
                      @change="forceUpdate"
                    ></a-tree-select>
                    <!-- <a-tree-select
                      v-if="industryStandardsEditable"
                      v-model="industryStandards.industryType"
                      :tree-data="deviceTypeTree"
                      tree-checkable
                      :treeCheckStrictly="true"
                      allow-clear
                      :disabled="!industryStandardsEditable"
                      placeholder="请选择类型"
                      @change="forceUpdate"
                    /> -->
                    <span
                      class="span-line-height"
                      v-if="!industryStandardsEditable"
                      >{{ deviceInfo.industryTypeNames }}</span
                    >
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="标准品牌："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <span class="span-line-height">{{
                      industryStandards.labelBrand
                    }}</span>

                    <a
                      style="margin-left: 15px"
                      v-if="
                        industryStandardsEditable &&
                        industryStandards.labelBrand == 'Unknown'
                      "
                      @click="labelBrandErrorCorrection()"
                      v-wx-role="101302"
                      >纠错
                    </a>

                    <a
                      style="margin-left: 15px"
                      v-if="
                        industryStandardsEditable &&
                        industryStandards.labelBrand != 'Unknown'
                      "
                      @click="labelBrandErrorCorrection()"
                      v-wx-role="101302"
                      >取消纠错
                    </a>
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="标准型号："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <span class="span-line-height">{{
                      industryStandards.modelStandard
                    }}</span>

                    <a
                      style="margin-left: 15px"
                      v-if="
                        industryStandardsEditable &&
                        industryStandards.modelStandard == 'Unknown'
                      "
                      @click="modelStandardErrorCorrection()"
                      v-wx-role="101302"
                      >纠错
                    </a>
                    <a
                      style="margin-left: 15px"
                      v-if="
                        industryStandardsEditable &&
                        industryStandards.modelStandard != 'Unknown'
                      "
                      @click="labelBrandErrorCorrection()"
                      v-wx-role="101302"
                      >取消纠错
                    </a>
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="标准生产厂商："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <span class="span-line-height">{{
                      industryStandards.labelingAgency
                    }}</span>

                    <a
                      style="margin-left: 15px"
                      v-if="
                        industryStandardsEditable &&
                        industryStandards.labelingAgency == 'Unknown'
                      "
                      @click="labelingAgencyErrorCorrection()"
                      v-wx-role="101302"
                      >纠错
                    </a>
                    <a
                      style="margin-left: 15px"
                      v-if="
                        industryStandardsEditable &&
                        industryStandards.labelingAgency != 'Unknown'
                      "
                      @click="labelBrandErrorCorrection()"
                      v-wx-role="101302"
                      >取消纠错
                    </a>
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="关联器械注册/备案证号："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      v-model="industryStandards.standardCertificateNumber"
                      :disabled="!industryStandardsEditable"
                      placeholder="请输入关联器械注册/备案证号"
                    ></a-input>
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="原产国："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      v-model="industryStandards.countryOrigin"
                      :disabled="!industryStandardsEditable"
                      placeholder="请输入原产国"
                    >
                    </a-input>
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="使用有效期(年)："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      v-model="industryStandards.standardUseValidityPeriod"
                      :disabled="!industryStandardsEditable"
                      placeholder="请输入使用有效期"
                    >
                    </a-input>
                  </a-form-model-item>
                </a-col>
              </a-row>
            </a-form>
          </div>
        </div>
      </div>

      <!-- 原始台账信息表单 -->
      <div class="management-form">
        <!-- 原始台账信息模块 -->
        <div class="info-module">
          <div class="module-header">
            <div class="module-title">原始台账信息</div>
            <div class="module-actions">
              <!-- <a
                    v-if="!originalLedgerEditable"
                    @click="originalLedgerEditModule()"
                    v-wx-role="101302"
                  >
                    <a-icon type="edit"
                  /></a> -->
              <!-- <a-button
                    v-if="originalLedgerEditable"
                    style="
                      font-size: 12px;
                      width: 40px;
                      background: #ffffff;
                      color: #f04764;
                      border: 1px solid;
                    "
                    @click="originalLedgerCancelEdit()"
                    >取消</a-button
                  > -->
              <!-- <a-button
                    style="font-size: 12px; width: 40px"
                    v-if="originalLedgerEditable"
                    type="primary"
                    @click="originalLedgerSaveModule()"
                    >保存</a-button
                  > -->
            </div>
          </div>
          <div class="form-content">
            <a-form layout="horizontal">
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="设备名称："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <span class="span-line-height">{{
                      originalLedger.primaryDeviceName
                    }}</span>
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="品牌："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <span class="span-line-height">{{
                      originalLedger.primaryBind
                    }}</span>
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="型号："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <span class="span-line-height">{{
                      originalLedger.primaryModel
                    }}</span>
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="生产厂商："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <span class="span-line-height">{{
                      originalLedger.manufacturer
                    }}</span>
                  </a-form-model-item>
                </a-col>
              </a-row>
            </a-form>
          </div>
        </div>
      </div>

      <!-- 使用信息表单 -->
      <div class="management-form">
        <!-- 基础信息模块 -->
        <div class="info-module">
          <div class="module-header">
            <div class="module-title">使用信息</div>
            <div class="module-actions">
              <a
                v-if="!usageInformationEditable"
                @click="usageInformationEditModule()"
                v-wx-role="101302"
              >
                <a-icon type="edit"
              /></a>
              <a-button
                v-if="usageInformationEditable"
                style="
                  font-size: 12px;
                  width: 40px;
                  background: #ffffff;
                  color: #f04764;
                  border: 1px solid;
                "
                @click="usageInformationCancelEdit()"
                >取消</a-button
              >
              <a-button
                style="font-size: 12px; width: 40px"
                v-if="usageInformationEditable"
                type="primary"
                @click="usageInformationSaveModule()"
                >保存</a-button
              >
            </div>
          </div>
          <div class="form-content">
            <a-form layout="horizontal">
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="安装日期："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-date-picker
                      v-if="usageInformationEditable"
                      v-model="usageInformation.installDate"
                      inputReadOnly
                      type="date"
                      format="YYYY-MM-DD"
                      valueFormat="YYYY-MM-DD"
                      :disabled="!usageInformationEditable"
                      placeholder="请选择安装日期"
                      @change="installDateChange"
                      style="width: 100%"
                    />
                    <span
                      class="span-line-height"
                      v-if="!usageInformationEditable"
                      >{{ deviceInfo.installDate }}</span
                    >
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="验收日期："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-date-picker
                      v-if="usageInformationEditable"
                      v-model="usageInformation.acceptanceDate"
                      inputReadOnly
                      type="date"
                      format="YYYY-MM-DD"
                      valueFormat="YYYY-MM-DD"
                      :disabled="!usageInformationEditable"
                      placeholder="请选择验收日期"
                      @change="acceptanceDateChange"
                      style="width: 100%"
                    />
                    <span
                      class="span-line-height"
                      v-if="!usageInformationEditable"
                      >{{ deviceInfo.acceptanceDate }}</span
                    >
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="启用日期："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                    :rules="$valid.required"
                  >
                    <a-date-picker
                      v-if="usageInformationEditable"
                      v-model="usageInformation.activationDate"
                      inputReadOnly
                      type="date"
                      format="YYYY-MM-DD"
                      valueFormat="YYYY-MM-DD"
                      :disabled="!usageInformationEditable"
                      placeholder="请选择启用日期"
                      @change="activationDateChange"
                      style="width: 100%"
                    />
                    <span
                      class="span-line-height"
                      v-if="!usageInformationEditable"
                      >{{ deviceInfo.activationDate }}</span
                    >
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="使用时长(天)："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <span class="span-line-height">
                      {{ getSyDay(usageInformation.activationDate) }}
                    </span>
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="备注："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      type="textarea"
                      v-model="usageInformation.remark"
                      :disabled="!usageInformationEditable"
                      placeholder="请输入备注"
                    ></a-input>
                  </a-form-model-item>
                </a-col>
              </a-row>
            </a-form>
          </div>
        </div>
      </div>

      <!-- 设备组成表单 -->
      <div class="management-form">
        <!-- 基础信息模块 -->
        <div class="info-module">
          <div class="module-header">
            <div class="module-title">设备组成</div>
            <div class="module-actions">
              <a
                v-if="!equipmentConsistEditable"
                @click="equipmentConsistEditModule()"
                v-wx-role="101302"
              >
                <a-icon type="edit"
              /></a>
              <a-button
                v-if="equipmentConsistEditable"
                style="
                  font-size: 12px;
                  width: 40px;
                  background: #ffffff;
                  color: #f04764;
                  border: 1px solid;
                "
                @click="equipmentConsistCancelEdit()"
                >取消</a-button
              >
              <a-button
                style="font-size: 12px; width: 40px"
                v-if="equipmentConsistEditable"
                type="primary"
                @click="equipmentConsistSaveModule()"
                >保存</a-button
              >
            </div>
          </div>
          <div class="form-content">
            <!-- 设备组成 -->
            <a-table
              :columns="contractPaymentTermColumns"
              :dataSource="contractPaymentTermList"
              :pagination="false"
              bordered
              size="middle"
              rowKey="key"
            >
              <!-- 自定义单元格渲染 - 可编辑单元格 v-for="(row, index) in data" -->
              <template
                v-for="col in editableContractPaymentTermColumns"
                :slot="col.dataIndex"
                slot-scope="text, record, index"
              >
                <div :key="col.dataIndex" class="editable-cell">
                  <span v-if="!equipmentConsistEditable">
                    {{ text }}
                  </span>
                  <a-input
                    v-else
                    type="number"
                    v-model="record[col.dataIndex]"
                    :min="0"
                    :class="{
                      'error-field':
                        record.errors && record.errors[col.dataIndex],
                    }"
                  />

                  <div
                    class="error-message"
                    v-if="record.errors && record.errors[col.dataIndex]"
                  >
                    {{ record.errors[col.dataIndex] }}
                  </div>
                </div>
              </template>

              <!-- 操作列 - 添加/删除行按钮 -->
              <template
                slot="action"
                slot-scope="text, record, index"
                v-if="equipmentConsistEditable"
              >
                <div class="action-buttons">
                  <a-tooltip title="添加一行">
                    <a-button
                      type="primary"
                      shape="circle"
                      icon="plus"
                      size="small"
                      @click="addContractPaymentTermRow(index)"
                      v-if="index === contractPaymentTermList.length - 1"
                      :disabled="hasContractPaymentTermErrors"
                    />
                  </a-tooltip>
                  <a-tooltip title="删除此行" v-if="index != 0">
                    <a-button
                      style="background-color: #d9d9d9"
                      type="default"
                      shape="circle"
                      icon="minus"
                      size="small"
                      @click="removeContractPaymentTermRow(index)"
                      v-if="
                        contractPaymentTermList.length > 1 &&
                        index === contractPaymentTermList.length - 1
                      "
                    />
                  </a-tooltip>
                </div>
              </template>
              <!-- 表头添加必填标识 -->
              <template slot="accessoryNameTitle" slot-scope="title">
                <span class="required-label">*</span>{{ title }}
              </template>
            </a-table>
          </div>
        </div>
      </div>

      <!-- 保修信息表单 -->
      <div class="management-form">
        <!-- 保修信息模块 -->
        <div class="info-module">
          <div class="module-header">
            <div class="module-title">保修信息</div>
            <div class="module-actions">
              <a
                v-if="!warrantyInformationEditable"
                @click="warrantyInformationEditModule()"
                v-wx-role="101302"
              >
                <a-icon type="edit"
              /></a>
              <a-button
                v-if="warrantyInformationEditable"
                style="
                  font-size: 12px;
                  width: 40px;
                  background: #ffffff;
                  color: #f04764;
                  border: 1px solid;
                "
                @click="warrantyInformationCancelEdit()"
                >取消</a-button
              >
              <a-button
                style="font-size: 12px; width: 40px"
                v-if="warrantyInformationEditable"
                type="primary"
                @click="warrantyInformationSaveModule()"
                >保存</a-button
              >
            </div>
          </div>
          <div class="form-content">
            <a-form layout="horizontal">
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="保修状态："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-select
                      v-if="warrantyInformationEditable"
                      :showArrow="true"
                      :allowClear="true"
                      v-model="warrantyInformation.repairState"
                      placeholder="请选择保修状态"
                      :disabled="!warrantyInformationEditable"
                      @change="forceUpdate"
                    >
                      <a-select-option
                        v-for="item in this.$sysDictOptions('repair_state')"
                        :key="item.k"
                        :value="item.k"
                      >
                        {{ item.v }}
                      </a-select-option>
                    </a-select>
                    <span
                      class="span-line-height"
                      v-if="!warrantyInformationEditable"
                      >{{
                        getDictName(deviceInfo.repairState, 'repair_state')
                      }}</span
                    >
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="保修到期日期："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-date-picker
                      v-if="warrantyInformationEditable"
                      v-model="warrantyInformation.warrantyExpirationDate"
                      inputReadOnly
                      type="date"
                      format="YYYY-MM-DD"
                      valueFormat="YYYY-MM-DD"
                      :disabled="!warrantyInformationEditable"
                      placeholder="请选择保修到期日期"
                      @change="warrantyExpirationDateChange"
                      style="width: 100%"
                    />
                    <span
                      class="span-line-height"
                      v-if="!warrantyInformationEditable"
                      >{{ deviceInfo.warrantyExpirationDate }}</span
                    >
                  </a-form-model-item>
                </a-col>
              </a-row>
            </a-form>
          </div>
        </div>
      </div>

      <!-- 售后服务表单 -->
      <div class="management-form">
        <!-- 售后服务模块 -->
        <div class="info-module">
          <div class="module-header">
            <div class="module-title">售后服务</div>
            <div class="module-actions">
              <a
                v-if="!afterSaleServiceEditable"
                @click="afterSaleServiceEditModule()"
                v-wx-role="101302"
              >
                <a-icon type="edit"
              /></a>
              <a-button
                v-if="afterSaleServiceEditable"
                style="
                  font-size: 12px;
                  width: 40px;
                  background: #ffffff;
                  color: #f04764;
                  border: 1px solid;
                "
                @click="afterSaleServiceCancelEdit()"
                >取消</a-button
              >
              <a-button
                style="font-size: 12px; width: 40px"
                v-if="afterSaleServiceEditable"
                type="primary"
                @click="afterSaleServiceSaveModule()"
                >保存</a-button
              >
            </div>
          </div>
          <div class="form-content">
            <a-form layout="horizontal">
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="售后服务机构："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      v-model="afterSaleService.afterSalesServiceOrganization"
                      :disabled="!afterSaleServiceEditable"
                      placeholder="请输入售后服务机构"
                    ></a-input>
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="过保修期后年度保修费用(元/年/台设备)："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      v-model="afterSaleService.warrantyCosts"
                      :disabled="!afterSaleServiceEditable"
                      placeholder="请输入过保修期后年度保修费用"
                    ></a-input>
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="售后电话："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      v-model="afterSaleService.afterSalesPhone"
                      :disabled="!afterSaleServiceEditable"
                      placeholder="请输入售后电话"
                    ></a-input>
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="工程师联系方式："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      v-model="afterSaleService.engineerContactInformation"
                      :disabled="!afterSaleServiceEditable"
                      placeholder="请输入工程师联系方式"
                    ></a-input>
                  </a-form-model-item>
                </a-col>
              </a-row>
            </a-form>
          </div>
        </div>
      </div>

      <!-- 图片表单 -->
      <div class="management-form">
        <!-- 图片模块 -->
        <div class="info-module">
          <div class="module-header">
            <div class="module-title">图片</div>
            <div class="module-actions">
              <a
                v-if="!imageEditable"
                @click="imageEditModule()"
                v-wx-role="101302"
              >
                <a-icon type="edit"
              /></a>
              <a-button
                v-if="imageEditable"
                style="
                  font-size: 12px;
                  width: 40px;
                  background: #ffffff;
                  color: #f04764;
                  border: 1px solid;
                "
                @click="imageCancelEdit()"
                >取消</a-button
              >
              <a-button
                style="font-size: 12px; width: 40px"
                v-if="imageEditable"
                type="primary"
                @click="imageSaveModule()"
                >保存</a-button
              >
            </div>
          </div>
          <div class="form-content">
            <a-form layout="horizontal">
              <a-row :gutter="24">
                <a-col>
                  <a-form-model-item
                    label="二维码："
                    :label-col="{ span: 4 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <w-image-upload
                      :disabled="!imageEditable"
                      class="avatar-uploader"
                      text="上传"
                      :multipleFlag="true"
                      v-model="image.qrCodeImage"
                      bizPath="electronicSignature"
                    ></w-image-upload>
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col>
                  <a-form-model-item
                    label="门牌："
                    :label-col="{ span: 4 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <w-image-upload
                      :disabled="!imageEditable"
                      class="avatar-uploader"
                      text="上传"
                      :multipleFlag="true"
                      v-model="image.houseNumberImage"
                      bizPath="electronicSignature"
                    ></w-image-upload>
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col>
                  <a-form-model-item
                    label="铭牌："
                    :label-col="{ span: 4 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <w-image-upload
                      :disabled="!imageEditable"
                      class="avatar-uploader"
                      text="上传"
                      :multipleFlag="true"
                      v-model="image.nameplateImage"
                      bizPath="electronicSignature"
                    ></w-image-upload>
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col>
                  <a-form-model-item
                    label="资产编码："
                    :label-col="{ span: 4 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <w-image-upload
                      :disabled="!imageEditable"
                      class="avatar-uploader"
                      text="上传"
                      :multipleFlag="true"
                      v-model="image.assetCodeImage"
                      bizPath="electronicSignature"
                    ></w-image-upload>
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col>
                  <a-form-model-item
                    label="器械证："
                    :label-col="{ span: 4 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <w-image-upload
                      :disabled="!imageEditable"
                      class="avatar-uploader"
                      text="上传"
                      :multipleFlag="true"
                      v-model="image.instrumentCertificateImage"
                      bizPath="electronicSignature"
                    ></w-image-upload>
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col>
                  <a-form-model-item
                    label="医疗器械UDI："
                    :label-col="{ span: 4 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <w-image-upload
                      :disabled="!imageEditable"
                      class="avatar-uploader"
                      text="上传"
                      :multipleFlag="true"
                      v-model="image.udiImage"
                      bizPath="electronicSignature"
                    ></w-image-upload>
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col>
                  <a-form-model-item
                    label="全景："
                    :label-col="{ span: 4 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <w-image-upload
                      :disabled="!imageEditable"
                      class="avatar-uploader"
                      text="上传"
                      :multipleFlag="true"
                      v-model="image.panoramaImage"
                      bizPath="electronicSignature"
                    ></w-image-upload>
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col>
                  <a-form-model-item
                    label="其他："
                    :label-col="{ span: 4 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <w-image-upload
                      :disabled="!imageEditable"
                      class="avatar-uploader"
                      text="上传"
                      :multipleFlag="true"
                      v-model="image.otherImage"
                      bizPath="electronicSignature"
                    ></w-image-upload>
                  </a-form-model-item>
                </a-col>
              </a-row>
            </a-form>
          </div>
        </div>
      </div>
    </div>
    <div v-if="activeTab === 'basic'" class="content-wrapper">
      <!-- 资产信息表单 -->
      <div class="management-form">
        <!-- 资产信息模块 -->
        <div class="info-module">
          <div class="module-header">
            <div class="module-title">资产信息</div>
            <div class="module-actions">
              <a
                v-if="!assetInformationEditable"
                @click="assetInformationEditModule()"
                v-wx-role="101302"
              >
                <a-icon type="edit"
              /></a>
              <a-button
                v-if="assetInformationEditable"
                style="
                  font-size: 12px;
                  width: 40px;
                  background: #ffffff;
                  color: #f04764;
                  border: 1px solid;
                "
                @click="assetInformationCancelEdit()"
                >取消</a-button
              >
              <a-button
                style="font-size: 12px; width: 40px"
                v-if="assetInformationEditable"
                type="primary"
                @click="assetInformationSaveModule()"
                >保存</a-button
              >
            </div>
          </div>
          <div class="form-content">
            <a-form layout="horizontal">
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="资产编码："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      v-model="assetInformation.assetCode"
                      :disabled="!assetInformationEditable"
                      placeholder="请输入资产编码"
                    ></a-input>
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="国别："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-select
                      v-if="assetInformationEditable"
                      :size="'default'"
                      style="min-width: 100px"
                      :showArrow="true"
                      :allowClear="true"
                      v-model="assetInformation.differentCountrie"
                      placeholder="请选择国别"
                      :disabled="!assetInformationEditable"
                      @change="forceUpdate"
                    >
                      <a-select-option
                        v-for="item in this.$sysDictOptions(
                          'differentCountrie'
                        )"
                        :key="item.k"
                        :value="item.k"
                      >
                        {{ item.v }}
                      </a-select-option>
                    </a-select>
                    <span
                      class="span-line-height"
                      v-if="!assetInformationEditable"
                      >{{
                        getDictName(
                          deviceInfo.differentCountrie,
                          'differentCountrie'
                        )
                      }}</span
                    >
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="资产状态："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-select
                      v-if="assetInformationEditable"
                      :size="'default'"
                      style="min-width: 100px"
                      :showArrow="true"
                      :allowClear="true"
                      v-model="assetInformation.assetStatus"
                      placeholder="请选择"
                      :disabled="!assetInformationEditable"
                      @change="forceUpdate"
                    >
                      <a-select-option
                        v-for="item in this.$sysDictOptions('assetStatus')"
                        :key="item.k"
                        :value="item.k"
                      >
                        {{ item.v }}
                      </a-select-option>
                    </a-select>
                    <span
                      class="span-line-height"
                      v-if="!assetInformationEditable"
                      >{{
                        getDictName(deviceInfo.assetStatus, 'assetStatus')
                      }}</span
                    >
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="是否国产："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-select
                      v-if="assetInformationEditable"
                      :size="'default'"
                      style="min-width: 100px"
                      :showArrow="true"
                      :allowClear="true"
                      v-model="assetInformation.importedDomestic"
                      :disabled="!assetInformationEditable"
                      placeholder="请选择"
                      @change="forceUpdate"
                    >
                      <a-select-option
                        v-for="item in this.$sysDictOptions('importedDomestic')"
                        :key="item.k"
                        :value="item.k"
                      >
                        {{ item.v }}
                      </a-select-option>
                    </a-select>
                    <span
                      class="span-line-height"
                      v-if="!assetInformationEditable"
                      >{{
                        getDictName(
                          deviceInfo.importedDomestic,
                          'importedDomestic'
                        )
                      }}</span
                    >
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="固定资产："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-select
                      v-if="assetInformationEditable"
                      :size="'default'"
                      style="min-width: 100px"
                      :showArrow="true"
                      :allowClear="true"
                      v-model="assetInformation.isFixedAssets"
                      placeholder="请选择"
                      :disabled="!assetInformationEditable"
                      @change="forceUpdate"
                    >
                      <a-select-option
                        v-for="item in this.$sysDictOptions('whetherFlag')"
                        :key="item.k"
                        :value="item.k"
                      >
                        {{ item.v }}
                      </a-select-option>
                    </a-select>
                    <span
                      class="span-line-height"
                      v-if="!assetInformationEditable"
                      >{{
                        getDictName(deviceInfo.isFixedAssets, 'whetherFlag')
                      }}</span
                    >
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="单价(元)："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      v-model="assetInformation.unitPrice"
                      :disabled="!assetInformationEditable"
                      placeholder="请输入资产编码"
                    ></a-input>
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="用途："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      v-model="assetInformation.purpose"
                      :disabled="!assetInformationEditable"
                      placeholder="请输入用途"
                    ></a-input>
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="数量："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      v-model="assetInformation.number"
                      :disabled="!assetInformationEditable"
                      placeholder="请输入数量"
                    ></a-input>
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="资金来源："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-select
                      v-if="assetInformationEditable"
                      :size="'default'"
                      style="min-width: 100px"
                      :showArrow="true"
                      :allowClear="true"
                      v-model="assetInformation.sourceFunds"
                      placeholder="请选择"
                      :disabled="!assetInformationEditable"
                      @change="forceUpdate"
                    >
                      <a-select-option
                        v-for="item in this.$sysDictOptions('fundsSource')"
                        :key="item.k"
                        :value="item.k"
                      >
                        {{ item.v }}
                      </a-select-option>
                    </a-select>
                    <span
                      class="span-line-height"
                      v-if="!assetInformationEditable"
                      >{{
                        getDictName(deviceInfo.sourceFunds, 'fundsSource')
                      }}</span
                    >
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="总价(元)："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      v-model="assetInformation.assetValue"
                      :disabled="!assetInformationEditable"
                      placeholder="请输入总价(元)"
                    ></a-input>
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="采购日期："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-date-picker
                      v-if="assetInformationEditable"
                      v-model="assetInformation.purchaseDate"
                      inputReadOnly
                      type="date"
                      format="YYYY-MM-DD"
                      valueFormat="YYYY-MM-DD"
                      placeholder="请选择采购日期"
                      style="width: 100%"
                      @change="purchaseDateChange"
                      :disabled="!assetInformationEditable"
                    />
                    <span
                      class="span-line-height"
                      v-if="!assetInformationEditable"
                      >{{ deviceInfo.purchaseDate }}</span
                    >
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="供应商："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      v-model="assetInformation.assetSupplier"
                      :disabled="!assetInformationEditable"
                      placeholder="请输入供应商"
                    ></a-input>
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="入账日期："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-date-picker
                      v-if="assetInformationEditable"
                      v-model="assetInformation.postingDate"
                      inputReadOnly
                      type="date"
                      format="YYYY-MM-DD"
                      valueFormat="YYYY-MM-DD"
                      placeholder="请选择入账日期"
                      style="width: 100%"
                      :disabled="!assetInformationEditable"
                      @change="postingDateChange"
                    />
                    <span
                      class="span-line-height"
                      v-if="!assetInformationEditable"
                      >{{ deviceInfo.postingDate }}</span
                    >
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="经办人："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      v-model="assetInformation.handledBy"
                      :disabled="!assetInformationEditable"
                      placeholder="请输入经办人"
                    ></a-input>
                  </a-form-model-item>
                </a-col>
              </a-row>
            </a-form>
          </div>
        </div>
      </div>

      <!--折旧信息表单 -->
      <div class="management-form">
        <!-- 折旧信息模块 -->
        <div class="info-module">
          <div class="module-header">
            <div class="module-title">折旧信息</div>
            <div class="module-actions">
              <a
                v-if="!depreciationInformationEditable"
                @click="depreciationInformationEditModule()"
                v-wx-role="101302"
              >
                <a-icon type="edit"
              /></a>
              <a-button
                v-if="depreciationInformationEditable"
                style="
                  font-size: 12px;
                  width: 40px;
                  background: #ffffff;
                  color: #f04764;
                  border: 1px solid;
                "
                @click="depreciationInformationCancelEdit()"
                >取消</a-button
              >
              <a-button
                style="font-size: 12px; width: 40px"
                v-if="depreciationInformationEditable"
                type="primary"
                @click="depreciationInformationSaveModule()"
                >保存</a-button
              >
            </div>
          </div>
          <div class="form-content">
            <a-form layout="horizontal">
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="折旧年限(年)："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      type="number"
                      :min="0"
                      v-model="depreciationInformation.periodDepreciation"
                      :disabled="!depreciationInformationEditable"
                      placeholder="请输入折旧年限(年)"
                    ></a-input>
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="残值率(%)："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      v-model="depreciationInformation.residualValueRate"
                      :disabled="!depreciationInformationEditable"
                      placeholder="请输入残值率"
                    ></a-input>
                  </a-form-model-item>
                </a-col>
              </a-row>
              <a-row :gutter="24">
                <a-col :span="12">
                  <a-form-model-item
                    label="净值(元)："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      v-model="depreciationInformation.netWorth"
                      :disabled="!depreciationInformationEditable"
                      placeholder="请输入净值(元)"
                    ></a-input>
                  </a-form-model-item>
                </a-col>
                <a-col :span="12">
                  <a-form-model-item
                    label="残值(元)："
                    :label-col="{ span: 8 }"
                    :wrapper-col="{ span: 16 }"
                  >
                    <a-input
                      v-model="depreciationInformation.residualValue"
                      :disabled="!depreciationInformationEditable"
                      placeholder="请输入残值(元)"
                    ></a-input>
                  </a-form-model-item>
                </a-col>
              </a-row>
            </a-form>
          </div>
        </div>
      </div>
    </div>

    <a-drawer
      :maskClosable="true"
      width="85%"
      title="位置管理"
      placement="right"
      :closable="false"
      @close="devCampusAreaListClose"
      :destroyOnClose="true"
      :visible="devCampusAreaListOpen"
    >
      <dev-campus-area-list
        @close="devCampusAreaListClose"
        ref="devCampusAreaListRef"
      />
    </a-drawer>

    <a-drawer
      :maskClosable="true"
      width="85%"
      title="通用名"
      placement="right"
      :closable="false"
      :destroyOnClose="true"
      :visible="devArchiveCommonNameOpen"
      @close="devArchiveCommonNameCancel"
    >
      <dev-archive-common-name-list
        @ok="devArchiveCommonNameEditOk"
        @cancel="devArchiveCommonNameCancel"
        :type="true"
        ref="devArchiveCommonNameRef"
      />
    </a-drawer>

    <a-drawer
      :maskClosable="true"
      width="85%"
      title="标准品牌"
      placement="right"
      :closable="false"
      :destroyOnClose="true"
      :visible="labelBrandErrorOpen"
      @close="labelBrandCancel"
    >
      <dev-archive-label-brand-list
        @ok="labelBrandEditOk"
        @cancel="labelBrandCancel"
        :type="true"
        ref="labelBrandRef"
      />
    </a-drawer>

    <a-drawer
      :maskClosable="true"
      width="85%"
      title="标准型号"
      placement="right"
      :closable="false"
      :destroyOnClose="true"
      :visible="modelStandardErrorOpen"
      @close="modelStandardCancel"
    >
      <dev-archive-model-standard-list
        @ok="modelStandardEditOk"
        @cancel="modelStandardCancel"
        :type="true"
        ref="modelStandardRef"
      />
    </a-drawer>

    <a-drawer
      :maskClosable="true"
      width="85%"
      title="标准生产厂商"
      placement="right"
      :closable="false"
      :destroyOnClose="true"
      :visible="labelingAgencyErrorOpen"
      @close="labelingAgencyCancel"
    >
      <dev-archive-labeling-agencyList
        @ok="labelingAgencyEditOk"
        @cancel="labelingAgencyCancel"
        :type="true"
        ref="labelingAgencyRef"
      />
    </a-drawer>
  </a-drawer>
</template>

<script>
import moment from 'moment'
import { getAction, postAction } from '@/api/manage'
import { getDepartTree, getCompanyList } from '@/api/api'
import DevCampusAreaList from '../../devCampus/devCampusArea/DevCampusAreaList.vue'
import DevArchiveCommonNameList from '../devArchiveCommonName/DevArchiveCommonNameList.vue'
import DevArchiveLabelBrandList from '../devArchiveLabelBrand/DevArchiveLabelBrandList.vue'
import DevArchiveModelStandardList from '../devArchiveModelStandard/DevArchiveModelStandardList.vue'
import DevArchiveLabelingAgencyList from '../devArchiveLabelingAgency/DevArchiveLabelingAgencyList.vue'
import WImageUpload from '@/components/WxImageUpload/WImageUpload'
export default {
  name: 'DevArchiveEquipmentEdit',
  components: {
    DevCampusAreaList,
    DevArchiveCommonNameList,
    DevArchiveLabelBrandList,
    DevArchiveModelStandardList,
    DevArchiveLabelingAgencyList,
    WImageUpload,
  },
  computed: {
    editableContractPaymentTermColumns() {
      return this.contractPaymentTermColumns.filter(
        (col) => col.dataIndex !== 'action'
      )
    },
    // 检查是否有错误
    hasContractPaymentTermErrors() {
      return this.contractPaymentTermList.some(
        (row) => row.errors && Object.keys(row.errors).length > 0
      )
    },
  },
  data() {
    return {
      devCampusAreaListOpen: false,
      devArchiveCommonNameOpen: false,
      labelBrandErrorOpen: false,
      modelStandardErrorOpen: false,
      labelingAgencyErrorOpen: false,
      // 当前激活的标签页
      activeTab: 'management',
      deviceTypeTree: [],
      professionalClassificationIdTree: [],
      deviceClassificationTree: [],
      mandatoryInspectionCatalogTree: [],
      politicalProcurementCatalogueTree: [],
      commonMilitaryNameTree: [],
      fixedClassificationTree: [],
      fixedAssetClassificationCodeTree: [],
      campusBuildingFloorRoomTree: [],
      departmentTree: [],
      commonNameList: [],
      measurementInstrumentTree: [],
      // 设备基本信息
      deviceInfo: {
        deviceShortCode: undefined,
        deviceName: undefined,
        activeState: undefined,
        repairState: undefined,
        inputPerson: undefined,
        entryDate: undefined,
        qrCodeBase64: undefined,
      },

      // 管理信息数据
      management: {
        id: undefined,
        departmentIds: undefined,
        deviceClassificationIds: undefined,
        usingDepartmentIds: undefined,
        measurementInstruments: undefined,
        administrativeDept: undefined,
        politicalProcurementCatalogueIds: undefined,
        currentLocations: undefined,
        industryProfessionalClassification: undefined,
        commonMilitaryNameIds: undefined,
        plateNumber: undefined,
        assetManager: undefined,
        fixedClassificationIds: undefined,
        fixedAssetClassificationCodeIds: undefined,
        userName: undefined,
        professionalClassificationIds: undefined,
      },

      // 基础信息数据
      basicInformation: {
        id: undefined,
        deviceTypes: undefined,
        certificateNumber: undefined,
        deviceName: undefined,
        bind: undefined,
        model: undefined,
        manufacturerName: undefined,
        udi: undefined,
        serialNumber: undefined,
        manufactureDate: undefined,
        batchNumber: undefined,
        useValidityPeriod: undefined,
        expiringDate: undefined,
        isExpiringDate: undefined,
        registerCategories: undefined,
        managementCategory: undefined,
      },
      industryStandards: {
        id: undefined,
        commonName: 'Unknown',
        industryTypes: undefined,
        labelBrand: 'Unknown',
        modelStandard: 'Unknown',
        labelingAgency: 'Unknown',
        standardCertificateNumber: undefined,
        countryOrigin: undefined,
        standardUseValidityPeriod: undefined,
      },
      originalLedger: {
        id: undefined,
        primaryDeviceName: undefined,
        primaryBind: undefined,
        primaryModel: undefined,
        manufacturer: undefined,
      },
      usageInformation: {
        id: undefined,
        installDate: undefined,
        acceptanceDate: undefined,
        activationDate: undefined,
        remark: undefined,
      },
      contractPaymentTermColumns: [
        {
          title: '配件名称',
          dataIndex: 'accessoryName',
          width: 300,
          scopedSlots: {
            customRender: 'accessoryName',
            title: 'accessoryNameTitle',
          },
        },
        {
          title: '规格型号',
          dataIndex: 'specificationModel',
          scopedSlots: {
            customRender: 'specificationModel',
          },
        },
        {
          title: '建议更换周期（月）',
          dataIndex: 'suggestedReplacementCycle',
          scopedSlots: {
            customRender: 'suggestedReplacementCycle',
          },
        },
        {
          title: '备注',
          dataIndex: 'remark',
          scopedSlots: {
            customRender: 'remark',
          },
        },
        {
          title: '操作',
          dataIndex: 'action',
          width: '10%',
          scopedSlots: { customRender: 'action' },
        },
      ],
      contractPaymentTermList: [
        {
          key: Date.now().toString(),
          accessoryName: undefined,
          specificationModel: undefined,
          suggestedReplacementCycle: undefined,
          remark: undefined,
          archiveEquipmentId: undefined,
          errors: {},
        },
      ],
      warrantyInformation: {
        id: undefined,
        repairState: undefined,
        warrantyExpirationDate: undefined,
      },
      afterSaleService: {
        id: undefined,
        afterSalesServiceOrganization: undefined,
        warrantyCosts: undefined,
        afterSalesPhone: undefined,
        engineerContactInformation: undefined,
      },
      image: {
        id: undefined,
        qrCodeImage: undefined,
        houseNumberImage: undefined,
        nameplateImage: undefined,
        assetCodeImage: undefined,
        instrumentCertificateImage: undefined,
        udiImage: undefined,
        panoramaImage: undefined,
        otherImage: undefined,
      },
      assetInformation: {
        id: undefined,
        assetCode: undefined,
        assetStatus: undefined,
        isFixedAssets: undefined,
        purpose: undefined,
        sourceFunds: undefined,
        purchaseDate: undefined,
        postingDate: undefined,
        differentCountrie: undefined,
        importedDomestic: undefined,
        assetValue: undefined,
        number: undefined,
        unitPrice: undefined,
        assetSupplier: undefined,
        handledBy: undefined,
      },
      depreciationInformation: {
        id: undefined,
        periodDepreciation: undefined,
        residualValueRate: undefined,
        netWorth: undefined,
        residualValue: undefined,
      },
      url: {
        saveInfo: '/system/devArchiveEquipment/save',
        getInfo: '/system/devArchiveEquipment/info',
        getDeviceTypeTree: '/system/ktree/tree',
        getprofessionalClassificationIdTree:
          '/system/devProfessionalClassification/tree',
        getClassificationTree: '/system/devArchiveDeviceClassification/tree',
        getMandatoryInspectionCatalogTree:
          '/system/devArchiveMandatoryInspectionCatalog/tree',
        getPoliticalProcurementCatalogueTree:
          '/system/devArchivePoliticalProcurementCatalogue/tree',
        getCommonMilitaryNameTree: '/system/devArchiveCommonMilitaryName/tree',
        getFixedClassificationTree:
          '/system/devArchiveFixedClassification/tree',
        getFixedAssetClassificationCodeTree:
          '/system/devArchiveFixedAssetClassificationCode/tree',
        getCampusBuildingFloorRoomTree:
          '/system/devCampusBuildingFloorRoom/listTree',
        getDevArchiveCommonNameList: '/system/devArchiveCommonName/getList',
        getMeasurementInstrumentTree:
          '/system/devArchiveMeasurementInstrument/tree',
        saveManagement: '/system/devArchiveEquipment/saveManagement',
        saveBasicInformation:
          '/system/devArchiveEquipment/saveBasicInformation',
        saveIndustryStandards:
          '/system/devArchiveEquipment/saveIndustryStandards',
        saveUsageInformation:
          '/system/devArchiveEquipment/saveUsageInformation',
        saveWarrantyInformation:
          '/system/devArchiveEquipment/saveWarrantyInformation',
        saveAfterSaleService:
          '/system/devArchiveEquipment/saveAfterSaleService',
        saveImage: '/system/devArchiveEquipment/saveImage',
        saveAssetInformation:
          '/system/devArchiveEquipment/saveAssetInformation',
        saveDepreciationInformation:
          '/system/devArchiveEquipment/saveDepreciationInformation',
      },
      // 编辑状态
      managementEditable: false,
      basicInformationEditable: false,
      industryStandardsEditable: false,
      usageInformationEditable: false,
      equipmentConsistEditable: false,
      warrantyInformationEditable: false,
      afterSaleServiceEditable: false,
      assetInformationEditable: false,
      depreciationInformationEditable: false,
      imageEditable: false,
      commonNameErrorCorrectionEditable: false,
      labelBrandErrorCorrectionEditable: false,
      modelStandardErrorCorrectionEditable: false,
      labelingAgencyErrorCorrectionEditable: false,

      originalLedgerEditable: false,
      visible: false,
      formInfo: {},
      createByList: [],
    }
  },
  created() {
    this.getUserList()
    this.getCampusBuildingFloorRoom()
    // 专业分类
    this.getprofessionalClassificationId()
    //使用科室
    this.getDepartment()
    //器械分类
    this.getClassification()
    //强检目录
    this.getMandatoryInspectionCatalog()
    //政采目录
    this.getPoliticalProcurementCatalogue()
    //政府通用名
    this.getCommonMilitaryName()
    //固资分类
    this.getFixedClassification()
    //固定资产分类与代码
    this.getFixedAssetClassificationCode()
    //设备类型
    this.getDeviceType()
    //通用名
    this.getCommonNameList()
    //计量器具
    this.getMeasurementInstrument()
  },
  methods: {
    getDictName(value, dictType) {
      if (value) {
        var dictList = this.$sysDictOptions(dictType)
        return dictList[`wx${value}`].v
      }
      return '--'
    },
    forceUpdate() {
      this.$forceUpdate()
    },
    getSyDay(activationDate) {
      if (!activationDate) {
        return '0'
      }
      const today = new Date()
      const warrantyEndPeriod = new Date(activationDate) // 示例日期
      const timeDiff = today.getTime() - warrantyEndPeriod.getTime() // 时间差，以毫秒为单位
      const daysDiff = Math.ceil(timeDiff / (1000 * 3600 * 24)) // 转换为天数，并向上取整
      console.log('剩余天数:', daysDiff)
      return daysDiff
    },
    devArchiveCommonNameCancel() {
      this.devArchiveCommonNameOpen = false
    },
    devArchiveCommonNameEditOk(val) {
      this.industryStandards.commonName = val
    },
    commonNameErrorCorrection() {
      this.devArchiveCommonNameOpen = true
    },

    labelBrandCancel() {
      this.labelBrandErrorOpen = false
    },
    labelBrandEditOk(val) {
      this.industryStandards.labelBrand = val
    },
    labelBrandErrorCorrection() {
      this.labelBrandErrorOpen = true
    },

    modelStandardCancel() {
      this.modelStandardErrorOpen = false
    },
    modelStandardEditOk(val) {
      this.industryStandards.modelStandard = val
    },
    modelStandardErrorCorrection() {
      this.modelStandardErrorOpen = true
    },

    labelingAgencyCancel() {
      this.labelingAgencyErrorOpen = false
    },
    labelingAgencyEditOk(val) {
      this.industryStandards.labelingAgency = val
    },
    labelingAgencyErrorCorrection() {
      this.labelingAgencyErrorOpen = true
    },
    postingDateChange(value, dateString) {
      this.assetInformation.postingDate = dateString
    },
    purchaseDateChange(value, dateString) {
      this.assetInformation.purchaseDate = dateString
    },
    warrantyExpirationDateChange(value, dateString) {
      this.warrantyInformation.warrantyExpirationDate = dateString
    },
    activationDateChange(value, dateString) {
      this.usageInformation.activationDate = dateString
    },
    acceptanceDateChange(value, dateString) {
      this.usageInformation.acceptanceDate = dateString
    },
    installDateChange(value, dateString) {
      this.usageInformation.installDate = dateString
    },
    manufactureDateChange(value, dateString) {
      this.basicInformation.manufactureDate = dateString
    },
    expiringDateChange(value, dateString) {
      this.basicInformation.expiringDate = dateString
    },

    devCampusAreaListClose() {
      this.devCampusAreaListOpen = false
      this.getCampusBuildingFloorRoom()
    },
    getMeasurementInstrument() {
      getAction(this.url.getMeasurementInstrumentTree).then((res) => {
        this.measurementInstrumentTree = res.result.data
      })
    },
    //通用名
    getCommonNameList() {
      getAction(this.url.getDevArchiveCommonNameList).then((res) => {
        this.commonNameList = res.result.data
      })
    },
    //位置
    getCampusBuildingFloorRoom() {
      getAction(this.url.getCampusBuildingFloorRoomTree).then((res) => {
        this.campusBuildingFloorRoomTree = res.result.data
      })
    },
    //固定资产分类与代码
    getFixedAssetClassificationCode() {
      getAction(this.url.getFixedAssetClassificationCodeTree).then((res) => {
        this.fixedAssetClassificationCodeTree = res.result.data
      })
    },
    //固资分类
    getFixedClassification() {
      getAction(this.url.getFixedClassificationTree).then((res) => {
        this.fixedClassificationTree = res.result.data
      })
    },
    //政府通用名
    getCommonMilitaryName() {
      getAction(this.url.getCommonMilitaryNameTree).then((res) => {
        this.commonMilitaryNameTree = res.result.data
      })
    },
    //政采目录
    getPoliticalProcurementCatalogue() {
      getAction(this.url.getPoliticalProcurementCatalogueTree).then((res) => {
        this.politicalProcurementCatalogueTree = res.result.data
      })
    },
    //强检目录
    getMandatoryInspectionCatalog() {
      getAction(this.url.getMandatoryInspectionCatalogTree).then((res) => {
        this.mandatoryInspectionCatalogTree = res.result.data
      })
    },
    //器械分类
    getClassification() {
      getAction(this.url.getClassificationTree).then((res) => {
        this.deviceClassificationTree = res.result.data
      })
    },
    //使用科室
    getDepartment() {
      getDepartTree().then((res) => {
        this.departmentTree = res.result.data
      })
    },
    //设备类型
    getDeviceType() {
      getAction(this.url.getDeviceTypeTree, {}).then((res) => {
        this.deviceTypeTree = res.result.data
      })
    },
    //专业分类
    getprofessionalClassificationId() {
      getAction(this.url.getprofessionalClassificationIdTree, {}).then(
        (res) => {
          this.professionalClassificationIdTree = res.result.data
        }
      )
    },
    getUserList() {
      // 加载数据方法 必须为 Promise 对象
      var parameter = { pageNo: 1, pageSize: 1000000 }
      getCompanyList(Object.assign(parameter, this.queryParam)).then((res) => {
        this.createByList = res.result.data.records
      })
    },
    getCreateByName(text) {
      var obj = this.createByList.filter(
        (aa) => aa.companyId + '' == text + ''
      )[0]
      if (obj == null) {
        if (text) {
          return '系统管理员'
        } else {
          return '--'
        }
      }
      return obj.companyName
    },
    // 切换标签页
    tabChange(key) {
      this.activeTab = key
    },

    // 配置位置信息
    configLocation() {
      //this.$message.info('打开位置配置界面')
      this.devCampusAreaListOpen = true
    },

    //编辑
    managementEditModule() {
      this.managementEditable = true
    },
    // 取消编辑 - 将模块切换为只读模式
    managementCancelEdit() {
      this.edit({ type: '1', id: this.management.id })
      this.managementEditable = false
    },

    // 保存模块数据
    managementSaveModule() {
      // if (this.management.departmentIds) {
      //   this.management.departmentId = JSON.stringify(
      //     this.management.departmentIds
      //   )
      // }

      if (this.management.departmentIds) {
        this.management.departmentId = this.management.departmentIds
      }

      // if (this.management.deviceClassificationIds) {
      //   this.management.deviceClassificationId = JSON.stringify(
      //     this.management.deviceClassificationIds
      //   )
      // }

      if (this.management.deviceClassificationIds) {
        this.management.deviceClassificationId =
          this.management.deviceClassificationIds
      }

      // if (this.management.usingDepartmentIds) {
      //   this.management.usingDepartmentId = JSON.stringify(
      //     this.management.usingDepartmentIds
      //   )
      // }

      if (this.management.usingDepartmentIds) {
        this.management.usingDepartmentId = this.management.usingDepartmentIds
      }

      // if (this.management.measurementInstruments) {
      //   this.management.measurementInstrument = JSON.stringify(
      //     this.management.measurementInstruments
      //   )
      // }

      if (this.management.measurementInstruments) {
        this.management.measurementInstrument =
          this.management.measurementInstruments
      }

      // if (this.management.politicalProcurementCatalogueIds) {
      //   this.management.politicalProcurementCatalogueId = JSON.stringify(
      //     this.management.politicalProcurementCatalogueIds
      //   )
      // }

      if (this.management.politicalProcurementCatalogueIds) {
        this.management.politicalProcurementCatalogueId =
          this.management.politicalProcurementCatalogueIds
      }

      // if (this.management.commonMilitaryNameIds) {
      //   this.management.commonMilitaryNameId = JSON.stringify(
      //     this.management.commonMilitaryNameIds
      //   )
      // }

      if (this.management.commonMilitaryNameIds) {
        this.management.commonMilitaryNameId =
          this.management.commonMilitaryNameIds
      }
      if (this.management.currentLocations) {
        this.management.currentLocation = this.management.currentLocations + ''
      }
      // if (this.management.fixedClassificationIds) {
      //   this.management.fixedClassificationId = JSON.stringify(
      //     this.management.fixedClassificationIds
      //   )
      // }

      if (this.management.fixedClassificationIds) {
        this.management.fixedClassificationId =
          this.management.fixedClassificationIds
      }

      // if (this.management.fixedAssetClassificationCodeIds) {
      //   this.management.fixedAssetClassificationCodeId = JSON.stringify(
      //     this.management.fixedAssetClassificationCodeIds
      //   )
      // }

      if (this.management.fixedAssetClassificationCodeIds) {
        this.management.fixedAssetClassificationCodeId =
          this.management.fixedAssetClassificationCodeIds
      }

      // if (this.management.professionalClassificationIds) {
      //   this.management.professionalClassificationId = JSON.stringify(
      //     this.management.professionalClassificationIds
      //   )
      // }

      if (this.management.professionalClassificationIds) {
        this.management.professionalClassificationId =
          this.management.professionalClassificationIds
      }
      postAction(this.url.saveManagement, this.management).then((res) => {
        if (res.code == '0000') {
          console.log('管理信息保存成功>>>', res.result.data)
          this.managementEditable = false
          this.$message.success('管理信息保存成功')

          this.edit({ type: '1', id: res.result.data })
        } else {
          this.$message.error(res.content)
        }
      })
    },
    //编辑
    basicInformationEditModule() {
      this.basicInformationEditable = true
    },
    // 取消编辑 - 将模块切换为只读模式
    basicInformationCancelEdit() {
      this.edit({ type: '2', id: this.basicInformation.id })
      this.basicInformationEditable = false
    },

    // 保存模块数据
    basicInformationSaveModule() {
      // if (this.basicInformation.deviceTypes) {
      //   this.basicInformation.deviceType = JSON.stringify(
      //     this.basicInformation.deviceTypes
      //   )
      // }

      if (this.basicInformation.deviceTypes) {
        this.basicInformation.deviceType = this.basicInformation.deviceTypes
      }

      postAction(this.url.saveBasicInformation, this.basicInformation).then(
        (res) => {
          if (res.code == '0000') {
            console.log('基础信息保存成功>>>', res.result.data)
            this.basicInformationEditable = false
            this.$message.success('基础信息保存成功')

            this.edit({ type: '2', id: res.result.data })
          } else {
            this.$message.error(res.content)
          }
        }
      )
    },

    //编辑
    industryStandardsEditModule() {
      this.industryStandardsEditable = true
    },
    // 取消编辑 - 将模块切换为只读模式
    industryStandardsCancelEdit() {
      this.industryStandardsEditable = false
      this.edit({ type: '3', id: this.industryStandards.id })
    },

    // 保存模块数据
    industryStandardsSaveModule() {
      // if (this.industryStandards.industryTypes) {
      //   this.industryStandards.industryType = JSON.stringify(
      //     this.industryStandards.industryTypes
      //   )
      // }

      if (this.industryStandards.industryTypes) {
        this.industryStandards.industryType =
          this.industryStandards.industryTypes
      }

      postAction(this.url.saveIndustryStandards, this.industryStandards).then(
        (res) => {
          if (res.code == '0000') {
            console.log('行业标准信息保存成功>>>', res.result.data)
            this.industryStandardsEditable = false
            this.$message.success('行业标准信息保存成功')

            this.edit({ type: '3', id: res.result.data })
          } else {
            this.$message.error(res.content)
          }
        }
      )
    },
    // //编辑
    // originalLedgerEditModule() {
    //   this.originalLedgerEditable = true
    // },
    // // 取消编辑 - 将模块切换为只读模式
    // originalLedgerCancelEdit() {
    //   this.edit({ type: '4', id: this.originalLedger.id })
    //   this.originalLedgerEditable = false
    // },

    // // 保存模块数据
    // originalLedgerSaveModule() {
    //   postAction(this.url.saveor, this.management).then((res) => {
    //     if (res.code == '0000') {
    //       console.log('原始信息保存成功>>>', res.result.data)
    //       this.originalLedgerEditable = false
    //       this.$message.success('原始信息保存成功')

    //       this.edit({ type: '4', id: res.result.data })
    //     } else {
    //       this.$message.error(res.content)
    //     }
    //   })
    // },

    //编辑
    usageInformationEditModule() {
      this.usageInformationEditable = true
    },
    // 取消编辑 - 将模块切换为只读模式
    usageInformationCancelEdit() {
      this.usageInformationEditable = false
      this.edit({ type: '3', id: this.usageInformation.id })
    },

    // 保存模块数据
    usageInformationSaveModule() {
      postAction(this.url.saveUsageInformation, this.usageInformation).then(
        (res) => {
          if (res.code == '0000') {
            console.log('使用信息保存成功>>>', res.result.data)
            this.usageInformationEditable = false
            this.$message.success('使用信息保存成功')

            this.edit({ type: '3', id: res.result.data })
          } else {
            this.$message.error(res.content)
          }
        }
      )
    },

    //编辑
    equipmentConsistEditModule() {
      this.equipmentConsistEditable = true
      this.contractPaymentTermList = [
        {
          key: Date.now().toString(),
          accessoryName: undefined,
          specificationModel: undefined,
          suggestedReplacementCycle: undefined,
          remark: undefined,
          archiveEquipmentId: undefined,
          errors: {},
        },
      ]
    },
    // 取消编辑 - 将模块切换为只读模式
    equipmentConsistCancelEdit() {
      this.equipmentConsistEditable = false
      this.edit({ type: '5', id: this.formInfo.id })
    },

    // 保存模块数据
    equipmentConsistSaveModule() {
      if (this.contractPaymentTermList) {
        this.formInfo.equipmentConsist = JSON.stringify(
          this.contractPaymentTermList
        )
      }

      postAction(this.url.saveInfo, this.formInfo).then((res) => {
        if (res.code == '0000') {
          console.log('设备组成保存成功>>>', res.result.data)
          this.equipmentConsistEditable = false
          this.$message.success('设备组成保存成功')

          this.edit({ type: '3', id: res.result.data })
        } else {
          this.$message.error(res.content)
        }
      })
    },

    // 添加新行
    addContractPaymentTermRow(index) {
      if (this.hasContractPaymentTermErrors) return
      var indexOf = index + 1
      console.log('indexOf+1>>', indexOf + 1)
      this.contractPaymentTermList.splice(indexOf, 0, {
        key: Date.now().toString(),
        accessoryName: undefined,
        specificationModel: undefined,
        suggestedReplacementCycle: undefined,
        remark: undefined,
        archiveEquipmentId: undefined,
        errors: {},
      })
    },

    // 删除行
    removeContractPaymentTermRow(index) {
      this.contractPaymentTermList.splice(index, 1)
    },

    // 验证字段
    validateContractPaymentTermField(record, field) {
      // 清除旧错误
      if (record.errors && record.errors[field]) {
        this.$delete(record.errors, field)
      }

      // 必填校验规则
      const requiredFields = ['accessoryName']
      if (requiredFields.includes(field) && !record[field]) {
        this.$set(
          record.errors,
          field,
          `${this.getContractPaymentTermFieldTitle(field)}不能为空`
        )
      }
    },

    // 获取字段标题
    getContractPaymentTermFieldTitle(field) {
      const column = this.contractPaymentTermColumns.find(
        (col) => col.dataIndex === field
      )
      return column ? column.title : field
    },

    //编辑
    warrantyInformationEditModule() {
      this.warrantyInformationEditable = true
    },
    // 取消编辑 - 将模块切换为只读模式
    warrantyInformationCancelEdit() {
      this.edit({ type: '1', id: this.warrantyInformation.id })
      this.warrantyInformationEditable = false
    },

    // 保存模块数据
    warrantyInformationSaveModule() {
      postAction(
        this.url.saveWarrantyInformation,
        this.warrantyInformation
      ).then((res) => {
        if (res.code == '0000') {
          console.log('保修信息保存成功>>>', res.result.data)
          this.warrantyInformationEditable = false
          this.$message.success('保修信息保存成功')

          this.edit({ type: '1', id: res.result.data })
        } else {
          this.$message.error(res.content)
        }
      })
    },

    //编辑
    afterSaleServiceEditModule() {
      this.afterSaleServiceEditable = true
    },
    // 取消编辑 - 将模块切换为只读模式
    afterSaleServiceCancelEdit() {
      this.edit({ type: '7', id: this.afterSaleService.id })
      this.afterSaleServiceEditable = false
    },

    // 保存模块数据
    afterSaleServiceSaveModule() {
      postAction(this.url.saveAfterSaleService, this.afterSaleService).then(
        (res) => {
          if (res.code == '0000') {
            console.log('售后服务保存成功>>>', res.result.data)
            this.afterSaleServiceEditable = false
            this.$message.success('售后服务保存成功')

            this.edit({ type: '7', id: res.result.data })
          } else {
            this.$message.error(res.content)
          }
        }
      )
    },

    //编辑
    imageEditModule() {
      this.imageEditable = true
    },
    // 取消编辑 - 将模块切换为只读模式
    imageCancelEdit() {
      this.edit({ type: '7', id: this.image.id })
      this.imageEditable = false
    },

    // 保存模块数据
    imageSaveModule() {
      postAction(this.url.saveImage, this.image).then((res) => {
        if (res.code == '0000') {
          console.log('图片保存成功>>>', res.result.data)
          this.imageEditable = false
          this.$message.success('图片保存成功')

          this.edit({ type: '7', id: res.result.data })
        } else {
          this.$message.error(res.content)
        }
      })
    },

    //编辑
    assetInformationEditModule() {
      this.assetInformationEditable = true
    },
    // 取消编辑 - 将模块切换为只读模式
    assetInformationCancelEdit() {
      this.edit({ type: '8', id: this.assetInformation.id })
      this.assetInformationEditable = false
    },

    // 保存模块数据
    assetInformationSaveModule() {
      postAction(this.url.saveAssetInformation, this.assetInformation).then(
        (res) => {
          if (res.code == '0000') {
            console.log('资产信息成功>>>', res.result.data)
            this.assetInformationEditable = false
            this.$message.success('资产信息保存成功')

            this.edit({ type: '8', id: res.result.data })
          } else {
            this.$message.error(res.content)
          }
        }
      )
    },

    //编辑
    depreciationInformationEditModule() {
      this.depreciationInformationEditable = true
    },
    // 取消编辑 - 将模块切换为只读模式
    depreciationInformationCancelEdit() {
      this.edit({ type: '9', id: this.depreciationInformation.id })
      this.depreciationInformationEditable = false
    },

    // 保存模块数据
    depreciationInformationSaveModule() {
      postAction(
        this.url.saveDepreciationInformation,
        this.depreciationInformation
      ).then((res) => {
        if (res.code == '0000') {
          console.log('折旧信息成功>>>', res.result.data)
          this.depreciationInformationEditable = false
          this.$message.success('折旧信息保存成功')

          this.edit({ type: '9', id: res.result.data })
        } else {
          this.$message.error(res.content)
        }
      })
    },

    add() {
      this.visible = true
      this.commonNameErrorCorrectionEditable = true
      this.labelBrandErrorCorrectionEditable = true
      this.modelStandardErrorCorrectionEditable = true
      this.labelingAgencyErrorCorrectionEditable = true

      this.edit()
    },
    csh() {
      this.management = {}
      this.basicInformation = {}
      this.industryStandards = {}
      this.originalLedger = {}
      this.usageInformation = {}
      this.contractPaymentTermList = []
      this.warrantyInformation = {}
      this.afterSaleService = {}
      this.image = {}
      this.assetInformation = {}
      this.depreciationInformation = {}
      this.managementEditable = false
      this.basicInformationEditable = false
      this.industryStandardsEditable = false
      this.originalLedgerEditable = false
      this.usageInformationEditable = false
      this.equipmentConsistEditable = false
    },
    moment,
    edit(record) {
      this.$objToOverride(this.formInfo, record)
      this.csh()
      if (this.formInfo.id) {
        getAction(this.url.getInfo, { id: record.id }).then((res) => {
          this.$nextTick(() => {
            this.deviceInfo = res.result.data

            this.management.id = this.formInfo.id
            this.basicInformation.id = this.formInfo.id
            this.industryStandards.id = this.formInfo.id
            this.originalLedger.id = this.formInfo.id
            this.usageInformation.id = this.formInfo.id
            this.warrantyInformation.id = this.formInfo.id
            this.afterSaleService.id = this.formInfo.id
            this.image.id = this.formInfo.id
            this.assetInformation.id = this.formInfo.id
            this.depreciationInformation.id = this.formInfo.id
            //START 设备信息
            if (this.deviceInfo.currentLocations != null) {
              this.management.currentLocations =
                this.deviceInfo.currentLocations.split(',')
            }

            if (this.deviceInfo.departmentId) {
              // var departmentIds = this.deviceInfo.departmentId.split(',')
              // var departmentIdList = []
              // departmentIds.forEach((departmentId) => {
              //   departmentIdList.push({ value: departmentId })
              // })

              //this.management.departmentIds = departmentIdList
              this.management.departmentIds = this.deviceInfo.departmentId
            }

            if (this.deviceInfo.deviceClassificationId) {
              // var deviceClassificationIds =
              //   this.deviceInfo.deviceClassificationId.split(',')
              // var deviceClassificationIdList = []
              // deviceClassificationIds.forEach((deviceClassificationId) => {
              //   deviceClassificationIdList.push({
              //     value: deviceClassificationId,
              //   })
              // })
              // this.management.deviceClassificationIds =
              //   deviceClassificationIdList

              this.management.deviceClassificationIds =
                this.deviceInfo.deviceClassificationId
            }

            if (this.deviceInfo.usingDepartmentId) {
              // var usingDepartmentIds =
              //   this.deviceInfo.usingDepartmentId.split(',')
              // var usingDepartmentIdList = []
              // usingDepartmentIds.forEach((usingDepartmentId) => {
              //   usingDepartmentIdList.push({
              //     value: usingDepartmentId,
              //   })
              // })
              // this.management.usingDepartmentIds = usingDepartmentIdList
              this.management.usingDepartmentIds =
                this.deviceInfo.usingDepartmentId
            }

            if (this.deviceInfo.measurementInstrument) {
              // var measurementInstruments =
              //   this.deviceInfo.measurementInstrument.split(',')
              // var measurementInstrumentList = []
              // measurementInstruments.forEach((measurementInstrument) => {
              //   measurementInstrumentList.push({
              //     value: measurementInstrument,
              //   })
              // })
              // this.management.measurementInstruments = measurementInstrumentList
              this.management.measurementInstruments =
                this.deviceInfo.measurementInstrument
            }

            this.management.administrativeDept =
              this.deviceInfo.administrativeDept

            if (this.deviceInfo.politicalProcurementCatalogueId) {
              // var politicalProcurementCatalogueIds =
              //   this.deviceInfo.politicalProcurementCatalogueId.split(',')
              // var politicalProcurementCatalogueIdList = []
              // politicalProcurementCatalogueIds.forEach(
              //   (politicalProcurementCatalogueId) => {
              //     politicalProcurementCatalogueIdList.push({
              //       value: politicalProcurementCatalogueId,
              //     })
              //   }
              // )
              // this.management.politicalProcurementCatalogueIds =
              //   politicalProcurementCatalogueIdList

              this.management.politicalProcurementCatalogueIds =
                this.deviceInfo.politicalProcurementCatalogueId
            }

            if (this.deviceInfo.industryProfessionalClassification) {
              this.management.industryProfessionalClassification =
                this.deviceInfo.industryProfessionalClassification
            }

            if (this.deviceInfo.commonMilitaryNameId) {
              // var commonMilitaryNameIds =
              //   this.deviceInfo.commonMilitaryNameId.split(',')
              // var commonMilitaryNameIdList = []
              // commonMilitaryNameIds.forEach((commonMilitaryNameId) => {
              //   commonMilitaryNameIdList.push({
              //     value: commonMilitaryNameId,
              //   })
              // })
              // this.management.commonMilitaryNameIds = commonMilitaryNameIdList

              this.management.commonMilitaryNameIds =
                this.deviceInfo.commonMilitaryNameId
            }

            this.management.plateNumber = this.deviceInfo.plateNumber

            this.management.assetManager = this.deviceInfo.assetManager

            this.management.userName = this.deviceInfo.userName

            if (this.deviceInfo.fixedClassificationId) {
              // var fixedClassificationIds =
              //   this.deviceInfo.fixedClassificationId.split(',')
              // var fixedClassificationIdList = []
              // fixedClassificationIds.forEach((fixedClassificationId) => {
              //   fixedClassificationIdList.push({
              //     value: fixedClassificationId,
              //   })
              // })
              // this.management.fixedClassificationIds = fixedClassificationIdList
              this.management.fixedClassificationIds =
                this.deviceInfo.fixedClassificationId
            }

            if (this.deviceInfo.fixedAssetClassificationCodeId) {
              // var fixedAssetClassificationCodeIds =
              //   this.deviceInfo.fixedAssetClassificationCodeId.split(',')
              // var fixedAssetClassificationCodeIdList = []
              // fixedAssetClassificationCodeIds.forEach(
              //   (fixedAssetClassificationCodeId) => {
              //     fixedAssetClassificationCodeIdList.push({
              //       value: fixedAssetClassificationCodeId,
              //     })
              //   }
              // )
              // this.management.fixedAssetClassificationCodeIds =
              //   fixedAssetClassificationCodeIdList

              this.management.fixedAssetClassificationCodeIds =
                this.deviceInfo.fixedAssetClassificationCodeId
            }

            if (this.deviceInfo.professionalClassificationId) {
              // var professionalClassificationIds =
              //   this.deviceInfo.professionalClassificationId.split(',')
              // var professionalClassificationIdList = []
              // professionalClassificationIds.forEach(
              //   (professionalClassificationId) => {
              //     professionalClassificationIdList.push({
              //       value: professionalClassificationId,
              //     })
              //   }
              // )
              // this.management.professionalClassificationIds =
              //   professionalClassificationIdList

              this.management.professionalClassificationIds =
                this.deviceInfo.professionalClassificationId
            }

            //END设备信息

            //START 基础信息

            this.basicInformation = this.deviceInfo

            if (this.deviceInfo.deviceType) {
              // var deviceTypes = this.deviceInfo.deviceType.split(',')
              // var deviceTypeList = []
              // deviceTypes.forEach((deviceType) => {
              //   deviceTypeList.push({
              //     value: deviceType,
              //   })
              // })
              // this.basicInformation.deviceTypes = deviceTypeList

              this.basicInformation.deviceTypes = this.deviceInfo.deviceType
            }

            //END 基础信息

            //START 行业标准信息

            this.industryStandards = this.deviceInfo

            if (this.deviceInfo.industryType) {
              // var industryTypes = this.deviceInfo.industryType.split(',')
              // var industryTypeList = []
              // industryTypes.forEach((industryType) => {
              //   industryTypeList.push({
              //     value: industryType,
              //   })
              // })
              // this.basicInformation.industryTypes = industryTypeList

              this.basicInformation.industryTypes = this.deviceInfo.industryType
            }

            if (!this.deviceInfo.commonName) {
              this.industryStandards.commonName = 'Unknown'
            }
            if (!this.deviceInfo.labelBrand) {
              this.industryStandards.labelBrand = 'Unknown'
            }
            if (!this.deviceInfo.modelStandard) {
              this.industryStandards.modelStandard = 'Unknown'
            }

            if (!this.deviceInfo.labelingAgency) {
              this.industryStandards.labelingAgency = 'Unknown'
            }

            //END 行业标准信息

            //START 原始信息
            this.originalLedger = this.deviceInfo

            //END 原始信息

            //START 使用信息
            this.usageInformation = this.deviceInfo

            //END 使用信息
            //START 设备组成
            if (this.deviceInfo.equipmentConsist) {
              this.contractPaymentTermList = JSON.parse(
                this.deviceInfo.equipmentConsist
              )
            }
            //END 设备组成

            //START 保修信息
            this.warrantyInformation = this.formInfo

            //END 保修信息

            //START 售后服务
            this.afterSaleService = this.formInfo
            //END 售后服务
            this.image = this.formInfo

            this.assetInformation = this.formInfo
            this.depreciationInformation = this.formInfo
          })
        })
      }
      this.visible = true
    },
    // 确定
    handleSubmit() {
      // 触发表单验证
      this.confirmLoading = true
      this.$refs.ruleForm.validate((valid) => {
        console.log(valid)
        if (valid) {
          postAction(this.url.saveInfo, this.formInfo)
            .then((res) => {
              this.$message.success(res.content)
              this.$emit('ok', this.formInfo)
              this.close()
            })
            .finally(() => {
              this.confirmLoading = false
            })
        } else {
          this.confirmLoading = false
        }
      })
    },
    // 关闭
    handleCancel() {
      this.close()
    },
    close() {
      this.$emit('close')
      this.visible = false
    },
    editorOk(val) {
      this.formInfo.content = val
    },
  },
}
</script>
<style scoped>
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC',
    'Microsoft YaHei', sans-serif;
  background-color: #f0f2f5;
  color: #333;
  padding: 20px;
}

.device-container {
  max-width: 1400px;
  margin: 0 auto;
  background: white;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
  overflow: hidden;
}

.device-header {
  /* background: linear-gradient(135deg, #1890ff 0%, #096dd9 100%); */
  /* color: white; */
  /* padding: 16px 24px; */
  display: flex;
  justify-content: space-between;
  align-items: end;
}

.device-info {
  display: flex;
  align-items: center;
  gap: 24px;
}

.device-name {
  font-size: 16px;
}

.device-id {
  font-size: 22px;
  font-weight: 600;
  font-family: system-ui;
  margin-left: 10px;
}

.device-status {
  display: flex;
  gap: 16px;
  margin-top: 0px;
}

.status-tag {
  padding: 4px 12px;
  border-radius: 5px;
  font-size: 12px;
  width: 50px;
  height: 25px;
  line-height: 14px;
}

.fault-status {
  background: #ff4d4f;
}

.no-warranty {
  background: #faad14;
}

.record-info {
  font-size: 14px;
  margin-left: 50%;
}

.record-info span {
  font-size: 14px;
  font-weight: 600;
  display: inline-block;
  width: 60px;
}

.line {
  width: 100%;
  height: 2px;
  background-color: #e8e8e8;
  margin: 10px 0;
}

.ant-form-item {
  margin-bottom: 8px !important;
}

.ant-form-item >>> .ant-form-item-label label {
  letter-spacing: 1px;
  font-weight: 600;
}

.ant-tabs >>> .ant-tabs-tab {
  font-size: 16px !important;
}

/* 标签页样式 */
.tabs-container {
  padding: 0 24px;
}

.ant-tabs-bar {
  margin-bottom: 0;
}

.ant-tabs-tab {
  padding: 16px 24px !important;
  font-size: 16px;
  font-weight: 500;
}

/* 内容区域 */
.content-wrapper {
  /* padding: 24px; */
  /* display: flex; */
}

.management-form {
  flex: 1;
  padding-right: 24px;
  margin-bottom: -40px;
}

.industry-info {
  width: 400px;
  padding-left: 24px;
  overflow-y: auto;
}

/* 模块样式 */
.info-module {
  margin-bottom: 30px;
  /* background: #fafafa; */
  border-radius: 6px;
  /* border: 1px solid #e8e8e8; */
  overflow: hidden;
}

.module-header {
  padding: 12px 24px;
  display: flex;
  justify-content: left;
  align-items: center;
  border-bottom: 1px solid #e8e8e8;
}

.module-title {
  font-weight: 600;
  font-size: 16px;
}

.module-actions {
  display: flex;
  gap: 10px;
  margin-left: 15px;
}

.form-content {
  /* padding: 24px; */
}

/* 表单样式 */
.ant-form-item {
  margin-bottom: 18px;
}

.ant-form-item-label {
  padding-right: 10px;
}

.ant-form-item-label label {
  color: #595959;
}

.ant-input,
.ant-select-selector {
  border-radius: 4px;
  border: 1px solid #d9d9d9;
}

/* 行业信息样式 */
.industry-card {
  background: #f9f9f9;
  border: 1px solid #e8e8e8;
  border-radius: 6px;
  margin-bottom: 24px;
}

.industry-card-header {
  background: #e6f7ff;
  padding: 12px 16px;
  border-bottom: 1px solid #e8e8e8;
}

.industry-card-title {
  font-weight: 600;
  color: #1890ff;
}

.industry-card-body {
  padding: 16px;
}

.industry-item {
  margin-bottom: 12px;
  padding-bottom: 12px;
  border-bottom: 1px dashed #f0f0f0;
}

.industry-item-title {
  font-weight: 500;
  color: #262626;
  margin-bottom: 4px;
}

.industry-item-value {
  color: #595959;
  padding-left: 12px;
}

.ant-input[disabled] {
  margin-top: 3px;
  background-color: #fff !important;
  border: none !important;
  color: rgba(0, 0, 0, 0.65) !important;
  cursor: not-allowed;
}

.ant-input {
  padding-left: 5px;
}

.span-line-height {
  line-height: 38px;
}
</style>
